import React from 'react';
import moment from 'moment';
import { Icon } from 'antd';
import ReactJson from 'react-json-view';
import _ from 'lodash';
import Mp3 from '../../components/Mp3';
import TextOverflow from '../../components/TextOverflow';

const renderState = (type) => {
  const map = {
    ready: {
      color: '#f9d936',
      icon: 'step-forward',
    },
    open: {
      color: 'green',
      icon: 'folder-open',
    },
    close: {
      color: 'red',
      icon: 'close',
    },
    doing: {
      color: 'orange',
      icon: 'clock-circle',
    },
    done: {
      color: 'green',
      icon: 'check',
    },
  };

  if (!map[type]) {
    return type;
  }
  return (
    <span style={{ color: map[type].color }}>
      <Icon type={map[type].icon} />&nbsp;&nbsp;{type}
    </span>);
};

const col = {
  id: {
    title: 'id',
  },
  name: {
    title: '名称',
  },
  age: {
    title: '年龄',
  },
  gender: {
    title: '性别',
    render: (text) => {
      if (text === 'male') {
        return '男';
      }
      if (text === 'female') {
        return '女';
      }
      return text;
    },
  },
  nation: {
    title: '种族',
  },
  guide: {
    title: '页面',
  },
  packageSize: {
    title: '包容量',
  },
  price: {
    title: '价格',
  },
  state: {
    title: '状态',
    render: (text) => {
      return renderState(text);
    },
  },
  // doing
  // close
  examineState: {
    title: '审核状态',
  },
  examiner: {
    title: '审核人',
  },
  examineStartTime: {
    title: '审核开始时间',
    render: (text) => {
      if (text) {
        return moment(text).format('MM-DD HH:mm:ss');
      }
      return text;
    },
  },
  examineEndTime: {
    title: '审核结束时间',
    render: (text) => {
      if (text) {
        return moment(text).format('MM-DD HH:mm:ss');
      }
      return text;
    },
  },
  createtime: {
    title: '创建时间',
    render: (text) => {
      return moment(Number(text)).format('MM-DD HH:mm:ss');
    },
  },
  delayTime: {
    title: '延迟时间',
  },
  min_repeat: {
    title: '最大重复',
  },
  max_repeat: {
    title: '最小重复',
  },
  settings: {
    title: '其他设置',
    render: (text) => {
      if (text && text.constructor === String) {
        try {
          const data = JSON.parse(text);
          return (<ReactJson
            src={data}
            name="设置选项"
            collapsed
            displayDataTypes={false}
            enableClipboard={false}
          />);
        } catch (e) {
          return text;
        }
      }
      return text;
    },
  },
  audio: {
    title: '音频文件',
    render: (text) => {
      // if (text && text.length >= 30) {
      //   return `${String(text).substr(0, 30)}...`;
      // }
      if (String(text).endsWith('.mp3')) {
        return (
          <Mp3 url={text} />
        );
      }
      return text;
    },
  },
  distributeNumber: {
    title: '分发次数',
  },
  doneNumber: {
    title: '完成数',
  },
  lineNumber: {
    title: '文本行',
  },
  text: {
    title: '文本',
    render: (text) => {
      // return text;
      return (
        <TextOverflow text={text} />
      );
    },
  },
  last_dst_time: {
    title: '上次分发时间',
    render: (text) => {
      if (Number(text) === 0) {
        return '未分发';
      }
      return moment(Number(text)).format('MM-DD HH:mm:ss');
    },
  },
  image: {
    title: '图片',
    render: (text) => {
      let data = [];
      try {
        data = JSON.parse(text); // data -> Array
      } catch (e) {
        console.log('[IMAGE_JSON_PARSE_ERROR]', e.message);
      }
      if (!data.length) {
        return null;
      }

      return data.map((item) => {
        return (
          <div style={{ height: 50 }}>
            <img style={{ height: '100%' }} src={item.url} alt="图片" key={item.uid} />
          </div>
        );
      });
    },
  },
  file: {
    title: '上传音频',
    render: (text) => {
      if (String(text).endsWith('.mp3')) {
        return (
          <Mp3 url={text} />
        );
      }
      return text;
    },
  },
};

Object.keys(col).forEach((key) => {
  col[key].dataIndex = key;
  col[key].key = key;
});


// 从keys中获取对应的col
export const getCol = (keys) => {
  const sort = Object.keys(col);
  // 按照预定顺序排序
  keys.sort((a, b) => {
    if (sort.indexOf(a) === -1) {
      return 1;
    }
    if (sort.indexOf(b) === -1) {
      return -1;
    }

    try {
      return sort.indexOf(a) - sort.indexOf(b);
    } catch (e) {
      return -1;
    }
  });
  return keys.map((item) => {
    return _.cloneDeep(col[item]) || {
      dataIndex: item,
      title: item,
      key: item,
    };
  });
};

export default col;
